<template>
	<div id="platform">
		<el-row>
			<el-col :span="8">
				<p><i class="iconfont">&#xe617;</i>公告<a href="mine_notice.html">查看</a></p>
			</el-col>
			<el-col :span="8">
				<p><i class="iconfont">&#xe618;</i>消息<a href="mine_msg.html">查看</a></p>
			</el-col>
			<el-col :span="8">
				<p><i class="iconfont">&#xe619;</i>我的提醒<a href="mine_reminder.html">查看</a></p>
			</el-col>
		</el-row>
	</div>
</template>
<script>
	export default {
		name: "platform"
	}
</script>
<style scoped lang="less" rel="stylesheet/less" type="text/css">
	@import '../../../public/css/variable.less';	
	.el-row{
		background: #fff;
		padding: 40px;
		box-sizing: border-box;
		.bdr(5px);
		height: 673px;
		min-height: 673px;
		.el-col{
			padding: 0 4%;
			p{
				border: 1px solid #dcdcdc;
				padding: 35px 0 30px;
				text-align: center;
				.bdr(5px);
				.trans(0.3s);
				box-sizing: border-box;
				color: #4f5564;
				.fonts(14px);
				i{
					position: relative;
					display: block;
					width: 88px;
					height: 88px;
					.bdr(50%);
					.fonts(90px);
					color: #bababa;
					margin: 0 auto 30px;
					&:after{
						content: "";
					    position: absolute;
					    left: 50%;
					    bottom: -20px;
					    width: 66px;
					    height: 1px;
					    border-bottom: 1px dashed #eaeaea;
					    margin-left: -33px;
					}
				}
				a{
					display: block;
					padding: 8px 0;
					border: 1px solid @cgolden;
					.bdr(5px);
					color: #d8b26a;
					width: 80px;
					margin: 15px auto 0;
					.trans(0.3s);
				}
				&:hover{
					color: @cw;
					background: @cgolden;
					i{ color: @cw; }
					a{
						border-color: @cw;
						color: @cw;
					}
				}
			}
		}
	}
</style>